﻿@using PagedList.Mvc;
@model TbShop.Web.Areas.Admin.Models.AuthorityViewListModels
@{
    ViewBag.Title = "权限列表";
    ViewBag.ModuleId = "Role";
    var roid = Request.QueryString["roleid"];
}

<link href="~/Scripts/icheck/skins/all.css" rel="stylesheet" />
<script src="~/Scripts/iCheck/js/custom.min.js"></script>
<script src="~/Scripts/iCheck/icheck.min.js"></script>
<div class="panel panel-default">
    <div class="panel-heading">
        <strong>权限列表</strong>
        <div class="pull-right">
            <a href="@(Url.Action("Index","Role"))"><span class='glyphicon glyphicon-arrow-left' aria-hidden='true'></span> 返回</a>
        </div>
    </div>
    <div class="panel-body">
        <table class="table table-bordered table-striped table-hover">
            <thead>
                <tr>
                    <th>选择</th>
                    <th>模块</th>
                    <th>菜单</th>
                    <th>功能</th>
                </tr>
            </thead>
            @foreach (var item in Model.AuthorityViewModels.Where(a => a.ParentId == 0))
            {
                var secondItem = Model.AuthorityViewModels.Where(a => a.ParentId == item.Id);
                var rowValue = secondItem.Count() + 1;
                <tr>
                    <td rowspan="@rowValue" style="vertical-align:middle;">
                        <div>
                            <label>
                                <input id='All@{@item.Id}' name="fathers" type="checkbox" onchange="checkFatherRole('@item.Id', this);">  <span id="Hint@{@item.Id}">全选</span>
                            </label>
                        </div>
                    </td>
                    <td rowspan="@rowValue" style="vertical-align:middle;">
                        <div>
                            <label>
                                <input id="@item.Id" name="@item.Id" type="checkbox" onchange="checkFatherRole('@item.Id', this)"> @item.Name
                            </label>
                        </div>
                    </td>
                </tr>
                foreach (var detail_item in secondItem)
                {
                    <tr>
                        <td>
                            <div>
                                <label>
                                    <input id="@detail_item.Id" name="@item.Id" type="checkbox" onchange="checkFatherRole('@detail_item.Id', this)"> @detail_item.Name
                                </label>
                            </div>
                        </td>
                        <td>
                            @{var i = 0;}
                            @foreach (var last_item in Model.AuthorityViewModels.Where(a => a.ParentId == detail_item.Id))
{
        <label>
            <input id="@last_item.Id"  type="checkbox" name="@item.Id" onchange="checkRole(this)"> @last_item.Name
        </label>@Html.Raw("&nbsp; &nbsp;")
                                
                                i++;
                                if (i % 9 == 0)
                                {
                                    i = 0;
                                    <br />
                                }
                            }
                        </td>
                    </tr>
                }
            }
        </table>
    </div>
    <div class="panel-footer">
    </div>
</div>
@section scripts{
    <script type="text/javascript">
        $(function () {
            var roleId = '@roid';
            loadRoleAuthority(roleId);
        });

        function checkRole(checkbox) {
            var roleId = '@roid';
            var ischecked = checkbox.checked;
            var authId = checkbox.id;
            $.ajax({
                type: 'POST',
                url: '@(Url.Action("UpdateRoleAuthority"))',
                data: { roleId: roleId, authId: authId, checkedState: ischecked },
                success: function (data) {
                    loadRoleAuthority(roleId)
                }
            });
        }

        function checkFatherRole(authId, checkbox) {
            var roleId = '@roid';
            var ischecked = checkbox.checked;
            $.ajax({
                type: 'POST',
                url: '@(Url.Action("UpdateFatherRoleAuthority"))',
                data: { roleId: roleId, authId: authId, checkedState: ischecked },
                success: function (data) {
                    loadRoleAuthority(roleId)
                }
            })
        }

        function loadRoleAuthority(roleId) {
            if (roleId != "") {
                $.ajax({
                    type: 'POST',
                    url: '@(Url.Action("GetRoleAuthority"))',
                    data: { roleId: roleId },
                    success: function (data) {
                        var dataObj = eval("(" + data + ")");//data中为选中角色现有的权限Id
                        var len = dataObj.length;
                        $('input[type="checkbox"]').prop('checked', false);//清空选中
                        for (var i = 0; i < len; i++) {//选中现有权限
                            var item = dataObj[i];
                            $("#" + item).prop('checked', true);
                        }
                        $('input[name="fathers"]').each(
                            function () {
                                var name = $(this).prop('id');
                                name = name.substr(3);//去除All前缀
                                var checkAll = true;
                                $('input[name=' + name + ']').each(function () {
                                    if ($(this).prop('checked') == false) {
                                        checkAll = false;
                                    }
                                });
                                $(this).prop('checked', checkAll);
                                $('#Hint' + name).html(checkAll ? "全不选" : "全选");
                            }
                        );
                    }
                })

            }
        }
    </script>
}